import { writable, derived } from 'svelte/store';
import { page } from '$app/stores';

export interface MenuItem {
	active: boolean;
	href: string;
	title: string;
	tag: boolean;
	icon?: string;
	subItems?: MenuItem[];
}

const _menuItems: MenuItem[] = [
	{
		active: false,
		href: '/solution',
		title: '解决方案',
		tag: false,
		icon: 'icon-dashboard',
		subItems: [
			{
				active: false,
				href: '/solution/group',
				title: '群小程序',
				tag: false
			},
			{
				active: false,
				href: '/solution/mall',
				title: '商城小程序',
				tag: false
			}
		]
	},
	{
		active: false,
		href: '/customer-case',
		title: '客户案例',
		tag: true,
		icon: 'icon-coupon'
	},
	{
		active: false,
		href: '/product-pricing',
		title: '产品定价',
		tag: true,
		icon: 'icon-prom'
	},
	{
		active: false,
		href: '/partner-plan',
		title: '合伙人计划',
		tag: true,
		icon: 'icon-card'
	},
	{
		active: false,
		href: '#',
		title: '比伶学院',
		tag: false,
		icon: 'icon-more'
	},
	{
		active: false,
		href: '#',
		title: '帮助中心',
		tag: false,
		icon: 'icon-more'
	}
];
export const menus = derived(page, ($page, set: (v: MenuItem[]) => void) => {
	set(
		_menuItems.map((i) => {
			i.active = $page.path.startsWith(i.href);
			return i;
		})
	);
});

export const tags = derived(menus, ($menus, set: (v: MenuItem[]) => void) => {
	set($menus.filter((i) => i.tag));
});

export const isSideBarOpen = writable(false);
